import 'package:flutter/material.dart';
import 'package:x_common_utils/utils/inkWell_util.dart';
import 'package:xinxuan/common/appbar_util.dart';
import 'package:xinxuan/common/button_util.dart';
import 'package:xinxuan/common/scroll_configuration_common.dart';
import 'package:xinxuan/controllers/my_controller/pay_bank_controller/pay_bank_list_page_controller.dart';
import 'package:xinxuan/router/app_routers.dart';
import 'package:xinxuan/utils/bank_code_util.dart';
import 'package:xinxuan/utils/card_util.dart';
import 'package:xinxuan/utils/color_util.dart';
import 'package:get/get.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:xinxuan/vo/common_vo/common_bank_card_item_vo.dart';

class PayBankListPage extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return GetBuilder<PayBankListPageController>(
      init: PayBankListPageController(),
      builder: (controller) {
        return Scaffold(
          appBar: AppBarUtil(
            title: '银行卡管理',
            backgroundColor: pageBgColor,
          ),
          body: controller.dataArr.length <= 0 ? Center(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Image.asset(
                  'assets/icons/icon_bank_def.png',
                  width: 273.w,
                  height: 146.h,
                ),
                Text(
                  '暂无银行卡，请先添加~',
                  style: TextStyle(
                    color: textSubtitleColor,
                    fontSize: 14.sp
                  ),
                )
              ],
            ),
          ) : ScrollConfigurationCommon(child: ListView(
            children: controller.dataArr.map((item) {
              return _bankItem(
                item: item
              );
            }).toList(),
          )),
          bottomNavigationBar: BottomAppBar(
            elevation: 0,
            child: Container(
              height: 56.h,
              padding: EdgeInsets.symmetric(horizontal: 12.w),
              alignment: Alignment.center,
              child: ButtonUtil(
                text: '添加银行卡', 
                fontSize: 16.sp, 
                borderRadius: 30.w, 
                height: 36.h, 
                onTop: () {
                  Get.toNamed('${AppRouters.COMMON_PAGE}${AppRouters.MY_INFO_PAGE}${AppRouters.PAY_BANK_LIST_PAGE}${AppRouters.ADD_PAY_BANK_PAGE}')!.then((res) {
                    controller.getPayBankList();
                  });
                }
              ),
            ),
          ),
        );
      },
    );
  }

  /// 银行卡
  Widget _bankItem({ required CommonBankCardItemVo item }) {
    return InkWellUtil.shakeProofInkWell(Container(
      padding: EdgeInsets.symmetric(horizontal: 12.w),
      margin: EdgeInsets.only(top: 12.h),
      child: Stack(
        children: [
          Container(
            height: 113.h,
            width: 351.w,
            padding: EdgeInsets.all(16.w),
            decoration: BoxDecoration(
              borderRadius: BorderRadius.vertical(top: Radius.circular(10.w)),
              gradient: LinearGradient(
                colors: [
                  bgBank1,
                  bgBank2,
                ]
              )
            ),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Row(
                  children: [
                    Container(
                      width: 30.w,
                      height: 30.w,
                      alignment: Alignment.center,
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(30.w),
                        color: bgWhiteColor
                      ),
                      child: Image.asset(
                        BankCodeUtil.getBankLogo(item.bank!.code!),
                        width: 18.w,
                        height: 18.w,
                        fit: BoxFit.cover,
                      ),
                    ),
                    SizedBox(width: 10.w),
                    Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          '${item.bank!.title}',
                          style: TextStyle(
                            color: textWhiteColor,
                            fontSize: 16.sp
                          ),
                        ),
                        Opacity(
                          opacity: .7,
                          child: Text(
                            '储蓄卡',
                            style: TextStyle(
                              color: textWhiteColor,
                              fontSize: 12.sp
                            ),
                          ),
                        )
                      ],
                    )
                  ],
                ),
                Row(
                  children: [
                    SizedBox(width: 40.w),
                    Column(
                      children: [
                        Text(
                          CardUtil.getPayCardStr('${item.cardNumber}'),
                          style: TextStyle(
                            color: textWhiteColor,
                            fontSize: 19.sp
                          ),
                        ),
                        SizedBox(height: 4.w)
                      ],
                    )
                  ],
                )
              ],
            ),
          ),
          Positioned(
            top: 35.h,
            right: 19.w,
            child: Image.asset(
              'assets/icons/icon_bank_unionPay.png',
              width: 105.w,
              height: 43.h,
            )
          )
        ],
      ),
    ), () {
      Get.toNamed(
        '${AppRouters.COMMON_PAGE}${AppRouters.MY_INFO_PAGE}${AppRouters.PAY_BANK_LIST_PAGE}${AppRouters.PAY_BANK_DETAIL_PAGE}',
        arguments: {
          'payBankItem': item
        }
      );
    });
  }
}